require("../../assets/css/normalize.css");
require("../../assets/css/reset.css");
require("../../assets/fonts/iconfont.css");
require("../../assets/css/tabbar.less");
require("../../assets/css/navbar.less");
require("./sports_crouse.less");
//引入模块
const axios = require("axios");
const dom = require("../../utils/dom.js");
document.addEventListener("DOMContentLoaded", function () {
	//头部和底部导航栏
	dom.tabbar("sport");
	dom.navbar("crouse");

	axios
		.get("http://fitness.h5.itsource.cn:3701/api/train/courseList")
		.then((res) => {
			//渲染最新课程课程
			let data = res.data.data;
			let newdata = data.shift();
			console.log(newdata);
			dom.get(".newcrouse img").src =
				"http://fitness.h5.itsource.cn:3701" + newdata.imgurl;
			dom.get(".newcrouse h3").textContent = newdata.name;
			dom.get(".newcrouse p").textContent = newdata.desc.slice(0, 18) + "...";
			dom.get(".newcrouse a").href =
				"sports_course_detail.html?id=" + newdata.courseId;

			let html = "";
			data.forEach(function (v) {
				html += `
				<li>
						<a href="sports_course_detail.html?id=${v.courseId}">
							<img src="http://fitness.h5.itsource.cn:3701${v.imgurl}" alt="" />
							<h3>${v.name}</h3>
							<p>${v.desc.slice(0, 18)}</p>
						</a>
					</li>
				`;
			});
			dom.get(".crouslist ul").innerHTML = html;
		});
});
